{extend name="$base" /}
{block name="resources"}
<link rel="stylesheet" type="text/css" href="WAP_CSS/member_recharge.css">
<style>
	.webuploader-element-invisible{
		opacity:0;
	}
	.mill-info-wrapper{
		background-color: white;
		padding: 10px 15px;
	}
	.mill-item{
		display: flex;
		height: 44px;
		line-height: 44px;
	}
	.mill-title{
		flex: 1;
	}
	.mill-item-content{
		flex: 0 0 50%;
		text-align: right;
	}
	.tip {
		text-align: center;
		color: #cccccc;
		margin-top: 10px;
	}
</style>
{/block}

{block name="main"}
{php}
$pay_no = api('System.Member.recharge');
$pay_no = $pay_no['data'];
{/php}
<div class="detail-main">


	<div class="payment">
		<span>{:lang('member_amount_money')}</span>
		<input id="pay_money" type="number" placeholder ="{:lang('member_input_balance')}"  onblur="check_pay_money(this)">
	</div>
	<div class="payment">
		<span>姓名</span>
		<input id="nick_name" type="text" placeholder ="请输入您的真实姓名"  >
	</div>
	<div class="payment">
		<span>联系电话</span>
		<input id="mobile" type="text" placeholder ="请输入您的联系电话"  >
	</div>


	<div class="input-div" style="display: none">
		<div class="id-number id_z  s-center">
			<img src="/upload/upload.jpg" class="lazy-load facepic" id="id_z_pre" data-url="{$id_z}">
		</div>
		<div class="tip">请上传您的支付凭证</div>
	</div>
	<input type="hidden" id="pay_no" value="{$pay_no}">

	<div class="payment" style="padding: 10px!important;box-sizing: border-box;">
		<div style="text-align: center">
			<textarea style="width: 98%;font: initial!important;" rows="5" id="message" type="text" placeholder ="请您输入留言内容" ></textarea>
		</div>
	</div>
	<div class="main-content" style="background: #ffffff;margin-bottom: 44px">
		<div style="padding: 10px;">公司账户信息：</div>
		<div class="content" style="margin-top: 10px;font-size: 16px;padding: 0px 20px;box-sizing: border-box">{$notice_info.content}</div>
	</div>

<div style="height: 44px"></div>
	<button class="ns-bg-color" type="button" onclick="calculateRecharge()">提交申请</button>
</div>
{/block}
{block name="script"}

<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript">
var lang_member_recharge = {
	member_amount_greater_zero : "{:lang('member_amount_greater_zero')}",
	member_recharge_failed : "{:lang('member_recharge_failed')}"
};
function check_pay_money(event){
	var pay_money = parseFloat($(event).val()).toFixed(2);
	if(isNaN(pay_money)){
		pay_money = 0.00; 
	}
	$(event).val(pay_money);
}
var is_submit = false;

function calculateRecharge(){
	var id_z = $("#id_z_pre").attr("src");
	var pay_money = $("#pay_money").val();
	var message = $("#message").val();

	var nick_name = $("#nick_name").val();
	var mobile = $("#mobile").val();




	if(pay_money < 0 || pay_money == '' || pay_money == 0){
		$("#pay_money").val(0).focus();
		toast(lang_member_recharge.member_amount_greater_zero);
		return;
	}

	if( nick_name == '' ){
		$("#nick_name").val('').focus();
		toast('请输入您的真实姓名');
		return;
	}

	if( mobile == '' ){
		$("#mobile").val('').focus();
		toast('请输入您的联系方式');
		return;
	}



	message = nick_name + '[' + mobile + ']：' + message;
	pig = true;
	//if (id_z == '/upload/upload.jpg') {toast("支付凭证必须上传");return false;}

	if(!pig){toast("请您稍等，正在上传支付凭证");return false;}
	if(is_submit) return;
	is_submit = true;
	api('System.Member.uploadPayPic',{"id_z":id_z,"pay_money":pay_money,"message":message},
			function (res) {
				if (res.data > 0) {

					if (/LT-APP/.test(navigator.userAgent)) {
						jsBridge.close("toast('已提交，请等待审核')");
					} else {
						toast('提交成功', __URL(APPMAIN + "/member/index"));
					}

				} else if (res["message"] != null) {
					is_submit = false;
					toast(res["message"]);
				}
			}
	)
}

let pig = false;
$(function(){
	id_z = WebUploader.create({
		server: __URL(APPMAIN + '/member/uploadImage'),
		auto : false, // 选择文件的按钮。可选。// 内部根据当前运行是创建，可能是input元素，也可能是flash.
		pick: '.id_z',
		fileNumLimit: 1, // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
		resize: false, // 只允许选择图片文件。
		accept: {
			title: 'Images',
			extensions: 'gif,jpg,jpeg,bmp,png',
			mimeTypes: 'image/*'
		},
		formData: {param: JSON.stringify({})},
		thumb: {width: 288,height: 160,crop: false}
	});
	// 当有文件被添加进队列的时候
	id_z.on('fileQueued', function (file) {
		curr_file = file;id_z.makeThumb(file, function (error, src) {
			if (error) {
				$("#id_z_pre").replaceWith('<span>不能预览</span>');
				return;
			}
			$("#id_z_pre").attr('src', src);
			id_z.upload()
		});
	});
	// 当上传成功的时候
	id_z.on('uploadSuccess', function (file, res) {
		if (curr_file) id_z.removeFile(curr_file);
		api('System.Member.modifyVerify', {'pic' : res.data,'qr' : 'pay_pic'}, function(res) {
			toast("上传成功！");
			pig = true;
		}, false);

	});

});
</script>
{/block}
{block name="footer"}{/block}